<template>
	<view class="content">

		<view class="topbar">
			<view class="address">轻工学院<u-icon name="arrow-down"></u-icon>
			</view>
			<view class="search">
				<u-search placeholder="日照香炉生紫" :clearabled="true"></u-search>
			</view>
			<u-icon name="account" class="u-m-t-5 u-m-l-5" @click="toLogin()"></u-icon>
		</view>

		<view class="menu">
			<view class="menu_top">
				<view class="menu_item" @click="toSongIndex()">急送</view>
				<view class="menu_item" @click="toMaiIndex()">急买</view>
				<view class="menu_item">急卖</view>
			</view>
			<view class="menu_bottom">
				<view class="menu_item">急问</view>
				<view class="menu_item">急助</view>
				<view class="menu_item">急查</view>
			</view>

		</view>	

		<view class="wrap">
			<u-swiper :list="list"></u-swiper>
		</view>

		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				keyword: '',			
				list: [{
						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
					}
				],

			}
		},
		onLoad() {
			
		},
		methods: {
			toLogin() {
				uni.navigateTo({
					url: '/pages/auth/login'
				});
			},
			toSongIndex() {
				uni.navigateTo({
					url: '/pages/index/jisong/songIndex'
				});
			},
			toMaiIndex() {
				uni.navigateTo({
					url: '/pages/index/jimai/jimai'
				});
			}

		}
	}
</script>

<style lang="scss" scoped>
	.content {}

	.topbar {
		display: flex;
		flex-direction: row;
		height: 102rpx;
		background-color: #aaaaff;

		.address {
			width: 180rpx;
			padding-top: 30rpx;
			padding-left: 20rpx;
		}

		.search {
			padding-top: 20rpx;
			width: 480rpx;
		}
	}

	.menu {
		height: 332rpx;
		background-color: #F2F2F2;
		display: flex;
		flex-direction: column;
		justify-content: space-around;

		.menu_top {
			display: flex;
			flex-direction: row;
			justify-content: space-around;

		}

		.menu_item {
			width: 90rpx;
			height: 90rpx;
			border: 1px solid black;
			border-radius: 50%;
			text-align: center;
			line-height: 90rpx;
		}

		.menu_bottom {
			display: flex;
			flex-direction: row;
			justify-content: space-around;

		}
	}

	.wrap {
		padding: 40rpx;
	}
</style>
